<script lang="ts" setup>
import { onMounted, ref } from "vue";
import { Api } from "@/apis";
import { DiscoverSpecialDataType } from "@/typing";

const specialList = ref<Array<DiscoverSpecialDataType>>([]);

onMounted(async () => {
    const { data } = await Api.getDiscoverSpecial();
    specialList.value = data.data;
})
</script>

<template>
    <div class="px-8 pb-32 pt-3">
        <div v-for="(l, i) in specialList" :key="i" class="mb-20 rounded-2xl bg-gray-100 shadow relative">
            <img class="rounded-t-2xl" :src="l.cover" alt="img">
            <div class="p-5">{{ l.title }}</div>
            <div class="absolute bottom-20 left-5 text-gray-300"># 专题</div>
        </div>
    </div>
</template>
